<template>
  <div>
    <a href="https://vitejs.dev" target="_blank">
      <img src="/vite.svg" class="logo" alt="Vite logo" />
    </a>
    <a href="https://vuejs.org/" target="_blank">
      <img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
    </a>
  </div>
  <HelloWorld msg="Vite + Vue" />
</template>

<script setup lang="ts">
import {ref} from 'vue'
import HelloWorld from './components/HelloWorld.vue'
const csbiServiceTreeInfos = [
  {
    category: 'MICRO_SERVICE',
    cloud_service_csbi_sn: 'CS12017535',
    cloud_service_id: '2017535',
    cloud_service_name: 'IoT边缘(IoTEdge)',
    csbi_parant_sn: 'CMS2023020200030',
    csbi_service_type: '2',
    csbi_sn: 'CMS2023021000026',
    id: 1745,
    lto_csbi_sn: 'CTE2021071600034',
    lto_id: '2051681',
    lto_name: '华为云计算全球生态部',
    micro_group_csbi_sn: 'CMS2023020200030',
    micro_group_id: '2072058',
    micro_group_name: 'FacilityCloud',
    name: 'AIManagement',
    product_department_csbi_sn: 'PD10012881',
    product_department_id: '12881',
    product_department_name: 'IoT服务产品部',
    service_id: 2072329,
    type: 'MICRO_SERVICE',
  },
  {
    category: 'MICRO_SERVICE',
    cloud_service_csbi_sn: 'CS12017535',
    cloud_service_id: '2017535',
    cloud_service_name: 'IoT边缘(IoTEdge)1',
    csbi_parant_sn: 'CMS2023020200030',
    csbi_service_type: '2',
    csbi_sn: 'CMS2023021000025',
    id: 1746,
    lto_csbi_sn: 'CTE2021071600034',
    lto_id: '2051681',
    lto_name: '华为云计算全球生态部',
    micro_group_csbi_sn: 'CMS2023020200030',
    micro_group_id: '2072058',
    micro_group_name: 'FacilityCloud',
    name: 'BAStudio',
    product_department_csbi_sn: 'PD10012881',
    product_department_id: '12881',
    product_department_name: 'IoT服务产品部1',
    service_id: 2072328,
    type: 'MICRO_SERVICE',
  },
]

let nameArr:string[] | string = 'lto_name,product_department_name,domain_name,cloud_service_name,micro_group_name,name'
nameArr = nameArr.split(',')
const addTreeData = (treeArr:any,data:any) => {
  for (let i = 0; i < treeArr.length; i++) {
    treeArr[i][treeArr[i].id] = data[treeArr[i].id]
    delete treeArr[i]['parent_id']
   if(treeArr[i].children && treeArr[i].children.length >= 1) {
     addTreeData(treeArr[i].children,data)
   }
  }
}

const init = (name:object,nameA:[]) => {
  let tree = []
  let treeLabelNames = Object.keys(name).filter(item => item.includes('name'))
  for (let i = 0; i < nameA.length ; i++) {
      if(!treeLabelNames.some(items => items === nameA[i])) {
        i = i
        nameA.splice(i,1)
      }
  }
  //获取的数组转换成树形数组
  tree = creatTree(nameA)
  addTreeData(tree,name)
  return tree
}
//递归变成树形
const creatTree = (name:[]) => {
  let trees = []
  trees =  name.map((item,index) => {
    if(index == 0) {
      return ({
        id:item,
        parent_id: '',
        children:[]
      })
    }
   return ({
     id:item,
     parent_id: name[index-1]
   })
  })
  return arrayToTreeV2(trees,'lto_name')
}
//将扁平化的数据转成成树形结构
const arrayToTreeV2 = (list:any, root:string) => {
  const result = [] // 用于存放结果
  const map:any = {} // 用于存放 list 下的节点

  // 遍历 list
  for (const item of list) {
    // 1. 获取节点的 id 和 父 id
    const { id, parent_id } = item // ES6 解构赋值

    // 2. 将节点存入 map
    if (!map[id]) map[id] = {}

    // 3. 根据 id，将节点与之前存入的子节点合并
    map[id] = map[id].children
        ? { ...item, children: map[id].children }
        : { ...item }

    // 4. 如果是根节点，存入 result
    if (id === root) {
      result.push(map[id])
    } else {
      // 5. 反之，存入父节点
      if (!map[parent_id]) map[parent_id] = {}
      if (!map[parent_id].children) map[parent_id].children = []
      map[parent_id].children.push(map[id])
    }
  }

  // 将结果返回
  return result
}

csbiServiceTreeInfos.forEach(item => {
  console.log(init(item, nameArr as []));
})


const query = (arr: [],name:string) => {
  const names = arr.map(item => item[name])
  return names.reduce((old,now) => {
      return old + now
  },0)
}
const names = ['a','b','c']

//这个是userCount的和

</script>

<style scoped>

</style>